<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <style>
        html{
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-style:sans-serif;
}
      body{
    width: 100%;
    height: 100%;
    font-family: 'Open Sans',sans-serif;
    margin: 0;
    background-color: lightskyblue;
          text-align: center!important;
}
#py-5 text-center container{
    position: absolute;
    top: 50%;
    left:50%;
    margin: -2000px 0 0 -200px;
    width: 500px;
    height: 500px;
    text-align: center!important;
}
#py-5 text-center container h2{
    color: #04aff8;
    text-shadow:0 0 10px;
    letter-spacing: 1px;
    text-align: center;
}
h1{
    color: #ce9fe6;
    font-size: 5em;
    margin: 0.67em 0;
}
input {
    width: 300px;
    height: 30px;
    margin-bottom: 10px;
    outline: none;
    padding: 10px;
    font-size: 13px;
    color: #000000;
    text-shadow:1px 1px 1px;
    border-top: 1px solid #312E3D;
    border-left: 1px solid #312E3D;
    border-right: 1px solid #312E3D;
    border-bottom: 1px solid #141515;
    border-radius: 4px;
    background-color: #ffffff;
}
.but {
 margin-top:20px;
    width :190px;
     height :45px;
    font-size :20px;
    font-weight :700;
    color:#fff ;
 background-image : linear-gradient( to right , #f5a3c4 0%, #ce9fe6 100%);
    border :0;
 border-radius :15px;;
}
.form-label{
      font-size: 2.5em;
}

    </style>
</head>
<body>

<h1>这是名字全称查询页</h1>

<section class="py-5 text-center container">
    <div class="row py-lg-5">
      <div class="col-lg-6 col-md-8 mx-auto">
          <form method='post' action="/result">

<div class="col-sm-6">
              <label for="firstname" class="form-label">First name</label>
              <input type="text" class="form-control" name="firstname" placeholder="" value="" required="">

            </div>
<div class="col-sm-6">
              <label for="lastname" class="form-label">Last name</label>
              <input type="text" class="form-control" name="lastname" placeholder="" value="" required="">

            </div>

    <p style="align:center"><input class="but" type="submit" valeu="提交"></p>
</form>
      </div>
    </div>
  </section>
</form>
</body>
</html>